@bg-color-black: #292929;//菜单背景色
@bg-main-white:white;//菜单背景白色
@header-bg-color:#181818;//标题背景色
@header-border-color:#929292;//菜单分割线
@text-color-croci: #BE9566;//标题下英文
@text-color-white: white;//白色字体
@text-color-black:black;//黑色
@text-color-gray:#888888;//字体颜色-灰色
@main-size:14px;
@main-size:16px;
html{
	font-size: 14px;
}
.flexs(@display:"",@direction:"",@a_items:normal,@j_content:normal,@width:auto,@pt:0px,@pe:0px,@pb:0px,@ps:0px,@grow:0,@wrap:wrap){
	display: @display;
	flex-direction: @direction;
	align-items: @a_items;
	justify-content: @j_content;
	width: @width;
	padding: @pt @pe @pb @ps;
	flex-grow: @grow ;
	flex-wrap: @wrap;
}
.img(@w,@h){
	width: @w;
	height: @h;
}
.position(@position:"",@t:auto,@b:auto,@l:auto,@r:auto,@z:auto){
	position: @position;
	top: @t;
	bottom: @b;
	left: @l;
	right: @r;
	z-index: @z;
}
.mobile{ display: block !important; }//移动端显示内容
.col-10{ flex: 0 0 auto;width: 83.33333333% !important; }
//菜单样式
.mobile_header{
	display: flex !important;
	flex-direction: column;
	align-items: center;
	color: @text-color-croci;
	background-color: @bg-color-black;
	height: auto;
	div {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		background-color: @header-bg-color;
		position: relative;
		img {
			height: 100%;
			flex-grow: 0;
			width: auto;
			padding-top: 0.5rem;
			padding-bottom: 0.5rem;
		}
		
		label {
			position: absolute;
			right: 0;
			height: 100%;
			display: flex;
			justify-content: center;
			align-items: center;
			width: 4rem;
			.icon-menu {
				display: contents !important;
			}
			
			.icon-quxiao {
				display: none;
			}
		}
	}
	ul{
		display: none;
		width: 100%;
		//height: calc(100vh - 4rem);
		li{
			display: flex;
			justify-content: space-between;
			border-bottom: 2px solid hsla(@header-border-color,20%);
			a{
				text-decoration: none;
				padding: 1rem;
				color: @text-color-white !important;
				width: 100%;
			}
			i{ color: @text-color-white;padding: 1rem; }
		}
	}
	
}
//点击菜单图标样式
#check:checked ~ .mobile_header{
	overflow-y: scroll;
	height: 100vh;
	.position(@position: fixed,@t: 0,@b: 0,@l: 0,@r: 0,@z:10);
	label{
		background-color: @bg-color-black;
		.icon-menu{ display: none !important; }
		.icon-quxiao{ display: block }
	}
	ul{
		display: block;
	}
}
.main{ margin: 0 !important; }
//轮播图块状滑动
//.swiper{
//	.swiper-pagination {
//		display: flex;
//		flex-direction: row;
//		justify-content: space-evenly;
//		.swiper-pagination-customs {
//			flex-grow: 1;
//			height: 3px;
//			background-color: hsla(@header-border-color, 20%);
//		}
//		.swiper-pagination-custom-active {
//			background-color: @text-color-croci !important;
//			height: 5px;
//		}
//	}
//}
//轮播图分页器样式
.swiper-pagination{
	.swiper-pagination-bullet{ width: 0.8rem;height: 0.8rem; }
	.swiper-pagination-bullet-active,.swiper-pagination-bullet-active-main{
		transform: scale(1);
		background: -webkit-radial-gradient( circle closest-side,@text-color-white 60%,@text-color-croci 100%);
	}
	.swiper-pagination-bullet-active-next,.swiper-pagination-bullet-active-next-next,.swiper-pagination-bullet-active-prev,.swiper-pagination-bullet-active-prev-prev{
		transform: scale(0.3);
	}
}
//隔断
.geduan{
	width: 100%;
	height: 2px;
	background-color: hsla( @text-color-gray,50%);
	span{
		display: block;
		width: 20%;
		height: 5px;
		background-color: @text-color-croci;
	}
}

//底部样式
.footer{
	.menu{
		flex-wrap: wrap !important;
		justify-content: flex-start !important;
		.col-10;
		padding-left: 0 !important;
		padding-right: 0 !important;
		.li_img{
			&>div{
				&>img{
					order: 1;
					align-self: flex-start !important;
					padding-bottom: 1rem;
					flex-grow: 0 !important;
				}
				&>div{
					bottom: 7rem !important;
				}
			}
		}
		
		ul{ padding: 0; }
		ul:nth-child(2){ order: 2;width: 100%; }
		ul:nth-child(1),ul:nth-child(3){ order: 3;width: 50%;}
		
	}
}

//公司定位
.index{
	.box_main{
		//height: calc(100vh - 4.5rem);
		//height: calc(100vh - 4.5rem);
		.swiper{
			//height: calc(100vh - 10rem);
			height:300px;
			.swiper-slide {
				img {
					object-fit: fill;
					height:100%;
				}
				&:hover{
					img {
						width: 100% !important;
						height: 100% !important;
					}
				}
			}
			.swiper-pagination{
				display: flex !important;
				justify-content: flex-end;
				height: 4rem;
				width: 100%;
				padding-right: 1rem;
				padding-bottom: 1rem;
				.swiper-pagination-custom{
					margin: 0.2rem 0.5rem 0.2rem 0.5rem;
				}
				.swiper-pagination-custom-mo{
					color: @text-color-croci;
					margin: 0.2rem 3rem 0.2rem 3rem;
				}
			}
		}
		.div_mobile{
			background-color: @text-color-croci;
			padding: 1rem 1rem 2rem 1rem;
			display: flex !important;
			justify-content: space-between;
			position: absolute;
			bottom: 0;
			z-index: 2;
			color: @text-color-white;
			width: 100%;
			height: 6rem;
			i{
				display: block;
				transform: rotate(90deg);
				font-size: 2rem;
				min-width: 2rem;
			}
		}
	}
	.box1{
		.main:extend(.amin){
			span{ .col-10; }
		}
	}
	.box2,.box3{
		.main:extend(.amin){
			.con-1{
				flex-wrap: wrap;
				justify-content: center;
				div{
					width: 110px;
					padding-top: 1rem;padding-bottom: 1rem;
				}
			}
		}
	}
	.box4{
		.main {
			.box4_Swiper {
				.col-10;
				padding-bottom: 3rem;
				padding-top: 3rem;
				a{
					display: flex;
					flex-direction: column;
					width: 100%;
					img {
						width: 100%;
						height: auto;
						padding-bottom: 1rem;
					}
					span {
						padding-left: 1rem;
						color: @text-color-black;
					}
				}
				&> .swiper-pagination{
					.swiper-pagination-bullet{ width: 0.8rem;height: 0.8rem; }
					.swiper-pagination-bullet-active,.swiper-pagination-bullet-active-main{
						transform: scale(1);
						background: -webkit-radial-gradient( circle closest-side,@text-color-white 60%,@text-color-croci 100%);
					}
					.swiper-pagination-bullet-active-next,.swiper-pagination-bullet-active-next-next,.swiper-pagination-bullet-active-prev,.swiper-pagination-bullet-active-prev-prev{
						transform: scale(0.3);
					}
				};
			}
		}
	}
	.box5{
		.main:extend(.amin) {
			.swiper {
				.col-10;
				.swiper-slide {
					flex-direction: column;
					align-items: center;
					width: 100% !important;
					
					span {
						color: @text-color-gray;
						padding-bottom: 1rem;
						align-self: flex-start;
					}
					
					&>a {
						.col-10;
					}
					
					div {
						width: 100% !important;
					}
				}
			}
		}
	}
	.box6{
		.main:extend(.main){
			div{
				.col-10;
			}
		}
	}
}

//关于我们
.about_content{
	.box1{
		.main{
			padding-top: 1rem;
			span{
				.col-10;
				padding-bottom: 1rem !important;
			}
		}
	}
	.box2,.box3{
		.swiper{
			.col-10;
		}
	}
}

//核心产品-案例展示1——case.html
.kernel_content{
	.main{
		margin-top: 3rem !important;
		.data-list{
			.col-10;
			div{
				div{
					flex-direction: column;
					justify-content: center;
					&>.mo_btn{
						padding: 0.2rem 1rem 0.2rem 1rem;
						width: fit-content;
						margin-top: 1rem;
						color: @text-color-white;
						background-color: @text-color-croci;
						align-self: flex-start;
					}
				}
				&:nth-child(2n+1){
					div{
						&>.mo_btn{
							align-self: flex-end;
						}
					}
				}
				div:nth-child(2n+1){
					padding: 0.5rem;
				}
				.left{
					&>span:nth-child(1){ display: none; }
					&>.title{ font-size: 1rem;font-weight: bold;color: @text-color-black }
					span:nth-child(3){
						display: -webkit-box;
						-webkit-line-clamp: 4;
						-webkit-box-orient: vertical;
						overflow: hidden;
						text-overflow: ellipsis;
					}
				}
				.right{
					a{
						height: auto !important;
						&:hover{
							img{
								width:100%;
							}
						}
					}
				}
			}
		}
	}
}

//案例展示
.case_content{
	.case_box{
		.main{
			.swiper{
				width: 100%;
				padding-bottom: 3rem;
				.swiper-slide {
					display: flex;
					flex-direction: column;
					align-items: center;
					padding-top: 2rem;
					padding-bottom: 2rem;
					 div{
						 display: flex;
						 flex-direction: column;
						 .col-10;
					 }
					&>div:first-child{
						padding-bottom: 1rem;
						&>span:first-child{ font-weight: bold; }
						&>span:nth-child(2){
							color: @text-color-gray;
							display: -webkit-box;
							-webkit-line-clamp: 5;
							-webkit-box-orient: vertical;
							overflow: hidden;
							text-overflow: ellipsis;
						}
					}
					&>div:last-child{
						background-color: @bg-main-white;
						border-radius: 1rem;
						box-shadow: 0 0 10px hsla(@bg-color-black,20%);
						&>img {
							width: 100%;
							border-top-right-radius: 1rem;
							border-top-left-radius: 1rem;
						}
						&>span{
							padding: 1rem;
						}
					}
				}
			}
		}
	}
}

//案例详情
.casedetails{
	.case_top{ p{ .col-10; } }
	.box1{
		.data-list{
			.col-10;
			.data-item{
				&>div{
					a{
						height: auto !important;
					}
					img{
						transition:none !important;
						width: 100% !important;
					}
					&:hover{
						box-shadow: 0 0 0 !important;
						transform: translateY(0) !important;
					}
				}
			}
			div{
				width: 100% !important;
				&>div{
					span{
						margin-top: 0.5rem !important;
						margin-bottom: 0.5rem !important;
					}
				}
			}
		}
	}
	.box2{
		.main{
			.swiper{
				.swiper-pagination{
					.swiper-pagination;
				}
			}
		}
	}
}

//案例详情2
.casedetails2{
	.case_top{
		span{.col-10;text-align: center;}
	}
	.box1{
		.main{
			span{
				.col-10;
			}
			img,span{
				padding-bottom: 0 !important;
				padding-top: 0 !important;
			}
			
		}
		.data-list{
			.col-10;
			.data-item{
				&>div{
					a{
						height: auto !important;
					}
					img{
						transition:none !important;
						width: 100% !important;
					}
					&:hover{
						box-shadow: 0 0 0 !important;
						transform: translateY(0) !important;
					}
				}
			}
			div{
				width: 100% !important;
				&>div{
					span{
						margin-top: 0.5rem !important;
						margin-bottom: 0.5rem !important;
					}
				}
			}
		}
	}
}

//关于我们
.contactus {
	.main {
		.swiper {
			margin-bottom: 3rem;
		}
		
		.contact {
			.col-10;
		}
		
		.con_qr {
			.col-10;
			display: flex !important;
			flex-direction: row;
			flex-wrap: wrap;
			justify-content: space-between;
			padding-top: 3rem;
			padding-bottom: 3rem;
			
			div {
				display: flex;
				width: 33.3333%;
				padding: 1rem;
				flex-direction: column;
				align-items: flex-start;
				
				img {
					width: 100%;
					height: fit-content;
				}
				
				span {
					color: @text-color-gray;
				}
				
				@media (max-width: 425px) {
					width: 50%;
				}
			}
		}
		
		& > img {
			padding-top: 3rem;
		}
	}
}


//新闻动态
.journalism{
	.main{
		.data-list{
			.col-10;
			.item{
				&>a{
					height:auto;
					box-shadow: 0 0 0;
				}
				.right{
					.title{
						font-size: 1rem;
						display: -webkit-box;
						-webkit-line-clamp: 2;
						-webkit-box-orient: vertical;
						overflow: hidden;
						text-overflow: ellipsis;
						padding: 0;
						margin-top: 0.5rem;
						margin-bottom: 0.5rem;
					}
					.desc{
						color: @text-color-gray;
						display: -webkit-box;
						-webkit-line-clamp: 2;
						-webkit-box-orient: vertical;
						overflow: hidden;
						text-overflow: ellipsis;
						padding: 0;
						margin-bottom: 0.5rem;
					}
					.item_click{
						width: fit-content;
					}
				}
			}
		}
		.pager{
			display: flex;
			justify-content: center;
			align-items: center;
			.col-10;
		}
	}
}

//新闻动态详情
.journalismdetails{
	img,span{ .col-10; }
}